<template>
	<view class="page">
		<view class="nav1">
			<view class="nav2" @click="cpcx">查询</view>
			<view class="nav2" @click="lhqr">理货确认</view>
		</view>
		<view style="margin-top: 10px;">
			<view style="overflow: hidden;height: 40px;">
				<view
					class="nav3">
					理货员:{{uinfo.cname}}</view>
				<view
					class="nav3">
					班组:{{uinfo.lhbb}}班</view>
				<view class="nav3">班次:{{ dqbc.id=="1"?"早班":dqbc.id=="2"?"中班":dqbc.id=="3"?"晚班":dqbc.id }} </view>
			</view>
			<view style="border: 2px solid #3c77b7;text-align: center;line-height:40px;height: 40px;font-size:20px;	">
				当班理货列表
			</view>
			<view style="overflow: hidden;height: 40px;">
				<view
					class="nav4">
					委托单号</view>
				<view
					class="nav4">
					货主</view>
				<view
					class="nav4">
					货名</view>
				<view
					class="nav4">
					预约车辆</view>
			</view>
			<view style="overflow: auto;height: 300px;margin-bottom: 60px;">
			<view style="overflow: hidden;height: 40px;" v-for="(item,index) in lhlist" :key="index" :class="{'itv1':cur1==item.id}">
				<view
					class="nav4"  @click="xzinfoitem(item)">
					{{item.orderons}}</view>
				<view
					class="nav4" @click="opens(item)">
					{{item.hzdwid}}</view>
				<view
					class="nav4">
					{{item.hname}}</view>
				<view
					class="nav4">
					{{item.cp}}</view>
			
			</view>
		</view>
		</view>
		
	<view  v-show="cptypeor" class="ck" style="border: 1px solid #3c77b7;">
		<view class="item3s">车牌查询</view>
		<view class="item4s">
			<view>车牌：</view>
			<view><input style="height: 40px;border-bottom: 3px solid #3c77b7;" type="text" v-model="cpnames"/></view>
			<view @click="seachcp()"  style="background-color: #3c77b7;color: #ffffff;font-weight: 600;border-radius: 10px;font-size: 16px;width: 60px;text-align: center;margin-left: 10px;">查询</view>
		</view>
		<view style="overflow: auto;height: 300px;">
				<view class="item6s" @click="addcpxz(item)" :class="{'itv1':cur2==item.id,'itv2':item.blackname==2}"  v-for="(item, index) in items4" :key="item.id">
						{{item.char1}}
				</view>
		</view>
		
		<view @click="qrcp" class="cz">确认选择</view>
		<view @click="gbcp" class="gb">关闭</view>
	</view>
	
	
	<view v-show="opentype" class="ck">
		<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
			<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;"
				@click="opentypeqx">关闭</view>
		</view>
		<view style="padding: 10px;" class="iss">
			<view>委托单号：{{openinfo.orderons}}</view>
			<view>货主：{{openinfo.hzdwid}}</view>
			<view>货名：{{openinfo.hname}}</view>
			<view>车队:{{openinfo.cdname}}</view>
			<view>货位:{{openinfo.hw}}</view>
			<view>操作过程:{{openinfo.czgc}}</view>
			<view>司机:{{openinfo.cname}}</view>
			<view>船名:{{openinfo.qm}}</view>
			<view>授权时间：{{openinfo.sqstartime}}-{{openinfo.sqendtime}}</view>
			<view>预约车辆：{{openinfo.cp}}</view>
			<!-- <view>状态：{{ openinfo.lhbbtype=="1"?"未授权":openinfo.lhbbtype=="2"?"无需理货":openinfo.lhbbtype=="3"?"已授权":openinfo.lhbbtype }}</view> -->
		</view>
	</view>
		<view class="ck" v-show="lhtype">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 15px;color: #ffffff;font-weight: 600;"
					@click="lhgb">关闭</view>
			</view>
			<view class="item4s">
				<view>货位：</view>
				<view><input style="height: 40px;border-bottom: 1px solid #3c77b7;" type="text" v-model="hw"/></view>
			</view>
			<view class="item4s">
				<view>件数：</view>
				<view><input style="height: 40px;border-bottom: 1px solid #3c77b7;" type="text" v-model="jsnum"/></view>
			</view>
			<view style="overflow: hidden;">
				<view class="nav2" @click="lh">理货</view>
				<view class="nav2" @click="lhgb">取消</view>
			</view>
		</view>
		<tabBar :pagePath="'/pages/shoquan/lihuo'"></tabBar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				uinfo: '',
				dqbc: '',
				cp: '',
				lhlist: [],
				info:'',
				oklh:false,
				cur1:'',
				xzinfo:'',
				cptypeor:false,
				items4:[],
				cur2:'',
				cpnames:'',
				cpinfo:'',
				opentype:false,
				openinfo:'',
				lhtype:false,
				hw:'',
				jsnum:0,
			}
		},
		async onLoad() {
			this.getuserinfo();
			this.getbancitimedqs();
			this.getlhylhlistall();
		},
		methods: {
			opentypeqx(){
				this.opentype = false
			},
			opens(e){
				this.opentype = true
				this.openinfo = e
			},
			gbcp(){
				this.cptypeor = false
			},
			qrcp(){
				if(this.cpinfo==''){
					uni.showToast({
						title: '请选择后在进行操作',
						icon: 'none',
						duration: 2000
					});
					return false;
				}
				
				this.cp = this.cpinfo.char1
				this.lhqrserch();
				this.cptypeor =false
			},
			addcpxz(e){
				this.cur2 = e.id
				this.cpinfo = e
			},
			async getcpmhlist() {
				let cpnames = this.cpnames
				let data = {
					cpname: cpnames,
				}
				let res = await this.$api.getcpmhlist(data)
				if (res.data.code == 0) {
					this.items4 = res.data.data
				}
			},
			seachcp(){
				this.getcpmhlist();
			},
			cpcx(){
				this.cptypeor =true
				this.getcpmhlist();
			},
			xzinfoitem(e){
				this.xzinfo = e
				this.cur1 = e.id
			},
			lhgb(){
				this.lhtype = false
			},
			lhqr(){
				if(this.cur1==''){
					uni.showToast({
						title: '请选择后在进行操作',
						icon: 'none',
						duration: 2000
					});
					return false;
				}
				let that = this
				this.lhtype = true
				// uni.showModal({
				// 	cancelText: "取消", // 取消按钮的文字  
				// 	confirmText: "确认", // 确认按钮文字 
				// 	title: '理货提示',
				// 	content: '是否理货当前任务?',
				// 	confirmColor: '#3B8BFF',
				// 	cancelColor: '#222222',
				// 	success: res => {
				// 		//that.delyuy(e);
				// 		if (res.confirm) {
				// 				console.log('用户点击确认');
				// 				this.lh();
				// 		} else if (res.cancel) {
				// 			console.log('用户点击取消');
				// 		}
				// 		console.log(res)
				// 	}
				// });
			},
			
			
			async lh(e){
				let data = {
					id:this.cur1,
					hw:this.hw,
					jsnum:this.jsnum,
					lhuid:this.uinfo.id
				}
				let res =  await this.$api.lhok(data)
				if(res.data.code==0){
					 this.lhtype = false;
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:this.uinfo.cname+'理货了任务',
						lv:1,
						type:3,
						cz:JSON.stringify(this.xzinfo)
					}	
					await this.$api.addlogs(data1)
					this.lhqrserch();
				}else{
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
				}	
			},
			ok(e){
					console.log(e)
				    this.oklh = true
					this.info = e
			},
			qxlh(){
					this.oklh = false
			},
			//搜索车牌进行理货确认
			async lhqrserch() {
				console.log(this.cp);
				let cp = this.cp
				let data = {
					id: uni.getStorageSync('uid'),
					cp: cp
				}
				let res = await this.$api.getlhylhlistall(data)
				console.log(res.data.data)
				if (res.data.code == 0) {
					this.lhlist = res.data.data
				}
			},
			
			//消息推送功能
			
			
			
			async getbancitimedqs() {
				let res = await this.$api.getbancitimedqs();
				console.log(res.data)
				this.dqbc = res.data
			},
			async getuserinfo() {
				let data = {
					id: uni.getStorageSync('uid')
				}
				let res = await this.$api.getuserinfo(data)
				console.log(res.data.code)
				if (res.data.code == 0) {
					this.uinfo = res.data.data
				}
			},

			async getlhylhlistall() {
				let data = {
					id: uni.getStorageSync('uid')
				}
				let res = await this.$api.getlhylhlistall(data)
				console.log(res.data.data)
				if (res.data.code == 0) {
					this.lhlist = res.data.data
				}
			},



		}
	}
</script>

<style>
	.page {
		background-color: #ffffff;
	}
	.nav1{
		height: 50px;
		overflow: hidden;
	}
	.nav2{
		float: left;
		height: 50px;
		line-height: 50px;
		text-align: center;
		border-radius: 10px;
		width: 40%;
		margin-left: 20px;
		font-size: 20px;
		color: #ffffff;
		background-color: #3c77b7;
	}
	.nav3{
		float: left;
		height: 40px;
		width: 33%;
		border:2px solid #3c77b7;
		text-align: center;
		line-height:40px;
		font-size: 16px;
	}
	.nav4{
		float: left;
		width: 25%;
		border:1px solid #3c77b7;
		text-align: center;
		line-height:40px;
		height: 40px;
		font-size: 16px;
		overflow: hidden;
		border-radius: 5px;
	}
	.ck{
		z-index:999;
		-moz-opacity:1;
		opacity: 1;
		position: fixed;
		background-color: #ffffff;
		width: 90%;
		border-radius: 5px;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		border: 1px solid #3c77b7;
	}
	.itv1{
		background-color: #3c77b7;
		color: #ffffff;
	}
	.item3s{
		background-color: #3c77b7;
		color: #ffffff;
		font-size: 20px;
		font-weight: 600;
		height: 40px;
		line-height: 40px;
		text-align: center;
	}
	.item4s{
		height: 50px;
		overflow: hidden;
	}
	.item4s view{
		height: 40px;
		line-height: 40px;
		float: left;
		font-size: 20px;
		padding-left: 5px;
		margin-top: 5px;
	}
	.item6s{
		border: 3px solid #3c77b7;
		height: 50px;
		width: 46%;
		margin-left: 5px;
		font-size: 20px;
		text-align: center;
		line-height: 50px;
		float: left;
		border-radius: 10px;
		margin-top: 10px;
	}
	.cz{
		background-color: #3c77b7;
		font-size: 20px;
		font-weight: 600;
		color: #ffffff;
		text-align: center;
		line-height: 40px;
		height: 40px;
	}
	.gb{
		background-color: red;
		font-size: 20px;
		font-weight: 600;
		color: #ffffff;
		text-align: center;
		line-height: 40px;
		height: 40px;
	}
	.itv2{
		background-color: #000102;
		color: #ffffff;
	}
	.iss view{
		font-size: 15px;
		height: 30px;
		line-height: 30px;
	}
	.c1{
		width: 80px;
		border: 3px solid #3c77b7;
		float: left;
		font-size: 16px;
		border-radius: 10px;
		height: 30px;
		line-height: 30px;
		text-align: center;
		margin-left: 20px;
	}
</style>